.mr-title-fix {
  position: fixed;
  top: 90px;
  padding: 0 20px;
  left: 0;
  right: 0;
  background: #fff;
  box-shadow: 0 1px 5px 0 hsl(0, 0%, 90%);
  display: flex;
  justify-content: flex-start;
  align-items: center;
  z-index: 21;
  .mr-title-info {
    width: 100vw;
    box-shadow: none;
  }
}

.mr-changes-title-fix {
  z-index: 21;
  position: fixed;
  top: 90px;
  padding: 0 20px;
  left: 0;
  right: 0;
  background: #fff;
  box-shadow: 0 1px 5px 0 #e5e5e5;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  .mr-title-info {
    width: 100vw;
    box-shadow: none;
  }
  &-left {
    flex: 1;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    .state-btn {
      text-align: left;
      line-height: 20px;
      font-size: 14px;
      color: #fff;
    }
    .left-info {
      .mr-title-text {
        text-align: left;
        font-weight: bold;
        color: #383838;
        margin-left: 12px;
        display: inline-block;
        width: 800px;
        outline: none;
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 4px;
      }
      .mr-push-all-btn {
        line-height: 24px;
        font-weight: bold;
        font-size: 12px;
        color: #a6a6a6;
        margin-left: 14px;
      }
    }
  }
  &-right {
    width: 300px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    .read-progress {
      margin-right: 20px;
      width: 160px;
      text-align: left;
      line-height: 20px;
      font-size: 12px;
      color: #595959;
    }
  }
}

.commits-range-overlay {
  width: 380px;
  background: #fff;
  border: 1px solid #e5e5e5;
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.drafts-num-badge {
  margin-left: 5px;
  margin-top: -3px;
  .next-badge-count {
    background: #fff;
    color: $primary-brand;
  }
}

.opacity0 {
  opacity: 0;
  z-index: -1;
}

.opacity1 {
  opacity: 1;
}
